DAY FIFTEEN, Monday, October 3, 2016 WEB DESIGN (FIRST COURSE) LEARNING GOALS
CONTRAST HTML and CSS.(Intro)
DESCRIBE how the web works.(1)
COMPARE Hamburgers to HTML.(2)
EXPLORE Browser based developer tools.(3)
EXPLAIN how to build a webapge from scratch. (4)
STYLE an existing HTML webpage with CSS. (5)
GUIDED LEARNING ACTIVITIES
Today we will watch and DISCUSS the first part of a web series named DON'T FEAR THE INTERNET (DFTI). About DFTI:
Through short tutorial videos, you’ll learn how to take a basic wordpress blog and manipulate the css, html (and even some php!) to match your aesthetic. You’ll feel empowered rather than crippled by the internet and worst case scenario you’ll at least end up having a better idea of how professional web designers turn your design dreams into a reality on screen.
Directions for DFTI Notes Assignment:
Sign in to Google Drive.
CREATE a new Google Doc named DFTI Notes Your Last Name.
Copy the following text and paste it into your doc. Bold the text.
Video No. 3: DON'T FEAR THE BROWSER Video No. 4: DON'T FEAR STARTING FROM SCRATCH Part 1: HTML Video No. 5: DON'T FEAR STARTING FROM SCRATCH Part 2: CSS Video No. 6: DON'T FEAR SPECIFICITY
As we view and DISCUSS each video during class, under each of the bolded headings, IDENTIFY 5-10 things you learned from each respective video using bullet points.
HOMEWORK
FINISH and submit any outstanding HTML work. We will begin working through HTML 05 on Wednesday during class.
ADVANCED WEB DESIGN (SECOND COURSE) LEARNING GOAL
Style sections of pages with semantic tags and CSS.
GUIDED LEARNING ACTIVITIES
READ and complete each project from pages 216 through 227.
Save each respective .html and .css file as directed to H:/HTML
Replace xx with your initials in each filename.
Add the following comments to the top of each page
Check each .html file in a browser as you go to ensure there are no mistakes. Each project is worth [4 marks].
Pages 216 and 217. Save as semantic-sectionxx.html
Pages 218 and 219. Save as semantic-articlexx.html
Pages 220 and 221. Save as semantic-headerxx.html
Pages 222 and 223. Save as semantic-navxx.html
Page 224 and 225. Save as semantic-asidexx.html
Page 226 and 227. Save as semantic-footerxx.html
Click the turn in button at the top of this post. Click file. Select each of the 6 .html files and submit [24 marks possible].
HOMEWORK
Finish and submit any HTML work that you have been unable to finish during class (All HTML work due Wed)
DAY SIXTEEN, Tuesday, October 4, 2016 WEB DESIGN LEARNING GOALS GUIDED LEARNING ACTIVITIES HOMEWORK
ADVANCED WEB DESIGN LEARNING GOALS
Style sections of pages with semantic tags and CSS.
GUIDED LEARNING ACTIVITIES
Continue working on the HTML Semantic Tag projects as directed above.
NO HOMEWORK DAY SEVENTEEN, Wednesday, October 5, 2016 WEB DESIGN LEARNING GOALS GUIDED LEARNING ACTIVITIES HOMEWORK
ADVANCED WEB DESIGN LEARNING GOALS GUIDED LEARNING ACTIVITIES
Finish and submit the HTML Semantic Tag projects as directed above.
NO HOMEWORK DAY EIGHTEEN, Thursday, October 6, 2016 WEB DESIGN LEARNING GOALS GUIDED LEARNING ACTIVITIES HOMEWORK
ADVANCED WEB DESIGN LEARNING GOALS
Design and develop a plan to enhance their Photoshop aptitudes.
CONSTRUCT multiple Photoshop projects for their design portfolios.
GUIDED LEARNING ACTIVITIES
Sign into drive.google.com. Create a new doc named Your Name Photoshop Plan.
IDENTIFY at least 3 learning goals that pertain to what you would like to get better at with Photoshop.
Ex. I would like to get better at (compositing, logo design, layer masks, filters, banners, photo effects, etc.)
IDENTIFY and complete 3-5 tutorials that will help you achieve your goals.
Save as PSE1.psd, PSE2.psd, and PSE3.psd to H:/Photoshop. Convert each .psd to .jpg (File>Save for Web).
Format for Photoshop Plan Doc (include 3 designs).
[60 marks possible]
IDENTIFY your goal [1 mark]
Insert a .jpg or screenshots showing progression of each design. [10 marks]
IDENTIFY the URL for each tutorial that was used. [1 mark]
EXPLAIN the design, the tools and techniques that were used. [6 marks]
DESCRIBE how the tutorial helped you achieve your goal. [2 marks]
How to Submit: Change the sharing settings of your Photoshop Plan doc to "anyone with the link can EDIT". Copy the link. Return to Edmodo. Click the turn in button above then submit the link to your shared document.
DAY NINETEEN, Friday, October 7, 2016 WEB DESIGN LEARNING GOALS GUIDED LEARNING ACTIVITIES HOMEWORK
ADVANCED WEB DESIGN LEARNING GOALS
Design and develop a plan to enhance their Photoshop aptitudes.
CONSTRUCT multiple Photoshop projects for their design portfolios.
GUIDED LEARNING ACTIVITIES
Sign into drive.google.com. Create a new doc named Your Name Photoshop Plan.
IDENTIFY at least 3 learning goals that pertain to what you would like to get better at with Photoshop.
Ex. I would like to get better at (compositing, logo design, layer masks, filters, banners, photo effects, etc.)
IDENTIFY and complete 3-5 tutorials that will help you achieve your goals.
Save as PSE1.psd, PSE2.psd, and PSE3.psd to H:/Photoshop. Convert each .psd to .jpg (File>Save for Web).
Format for Photoshop Plan Doc (include 3 designs). [60 marks possible]
IDENTIFY your goal [1 mark]
Insert a .jpg or screenshots showing progression of each design. [10 marks]
IDENTIFY the URL for each tutorial that was used. [1 mark]
EXPLAIN the design, the tools and techniques that were used. [6 marks]
DESCRIBE how the tutorial helped you achieve your goal. [2 marks]
How to Submit: Change the sharing settings of your Photoshop Plan doc to "anyone with the link can EDIT". Copy the link. Return to Edmodo. Click the turn in button above then submit the link to your shared document.
WEB DESIGN (FIRST COURSE)
LEARNING GOALS
- CONTRAST HTML and CSS.(Intro)
- DESCRIBE how the web works.(1)
- COMPARE Hamburgers to HTML.(2)
- EXPLORE Browser based developer tools.(3)
- EXPLAIN how to build a webapge from scratch. (4)
- STYLE an existing HTML webpage with CSS. (5)
GUIDED LEARNING ACTIVITIES- Today we will watch and DISCUSS the first part of a web series named DON'T FEAR THE INTERNET (DFTI). About DFTI:
- Through short tutorial videos, you’ll learn how to take a basic wordpress blog and manipulate the css, html (and even some php!) to match your aesthetic. You’ll feel empowered rather than crippled by the internet and worst case scenario you’ll at least end up having a better idea of how professional web designers turn your design dreams into a reality on screen.
- Directions for DFTI Notes Assignment:
- Sign in to Google Drive.
- CREATE a new Google Doc named DFTI Notes Your Last Name.
- Copy the following text and paste it into your doc. Bold the text.
Don't Fear The Internethttp://www.dontfeartheinternet.com/
Video No. 1: NOT A SERIES OF TUBES
- Fact 1
- Fact 2
- Fact 3
- Fact 4
- Fact 5
- Fact 6
- Fact 7
- Fact 8
- Fact 9
- Fact 10
Video No. 2: HTML- Fact 1, etc.
Video No. 3: DON'T FEAR THE BROWSERVideo No. 4: DON'T FEAR STARTING FROM SCRATCH Part 1: HTML
Video No. 5: DON'T FEAR STARTING FROM SCRATCH Part 2: CSS
Video No. 6: DON'T FEAR SPECIFICITY
- As we view and DISCUSS each video during class, under each of the bolded headings, IDENTIFY 5-10 things you learned from each respective video using bullet points.
HOMEWORKADVANCED WEB DESIGN (SECOND COURSE)
LEARNING GOAL
- Style sections of pages with semantic tags and CSS.
GUIDED LEARNING ACTIVITIES- READ and complete each project from pages 216 through 227.
- Save each respective .html and .css file as directed to H:/HTML
- Replace xx with your initials in each filename.
- Add the following comments to the top of each page
- Check each .html file in a browser as you go to ensure there are no mistakes. Each project is worth [4 marks].
- Pages 216 and 217. Save as semantic-sectionxx.html
- Pages 218 and 219. Save as semantic-articlexx.html
- Pages 220 and 221. Save as semantic-headerxx.html
- Pages 222 and 223. Save as semantic-navxx.html
- Page 224 and 225. Save as semantic-asidexx.html
- Page 226 and 227. Save as semantic-footerxx.html
- Click the turn in button at the top of this post. Click file. Select each of the 6 .html files and submit [24 marks possible].
HOMEWORKDAY SIXTEEN, Tuesday, October 4, 2016
WEB DESIGN
LEARNING GOALS
GUIDED LEARNING ACTIVITIES
HOMEWORK
ADVANCED WEB DESIGN
LEARNING GOALS
- Style sections of pages with semantic tags and CSS.
GUIDED LEARNING ACTIVITIES- Continue working on the HTML Semantic Tag projects as directed above.
NO HOMEWORKDAY SEVENTEEN, Wednesday, October 5, 2016
WEB DESIGN
LEARNING GOALS
GUIDED LEARNING ACTIVITIES
HOMEWORK
ADVANCED WEB DESIGN
LEARNING GOALS
GUIDED LEARNING ACTIVITIES
- Finish and submit the HTML Semantic Tag projects as directed above.
- EVALUATE the FH Optimist Club Website.
NO HOMEWORKDAY EIGHTEEN, Thursday, October 6, 2016
WEB DESIGN
LEARNING GOALS
GUIDED LEARNING ACTIVITIES
HOMEWORK
ADVANCED WEB DESIGN
LEARNING GOALS
- Design and develop a plan to enhance their Photoshop aptitudes.
- CONSTRUCT multiple Photoshop projects for their design portfolios.
GUIDED LEARNING ACTIVITIESFormat for Photoshop Plan Doc (include 3 designs).
[60 marks possible]
DAY NINETEEN, Friday, October 7, 2016
WEB DESIGN
LEARNING GOALS
GUIDED LEARNING ACTIVITIES
HOMEWORK
ADVANCED WEB DESIGN
LEARNING GOALS
- Design and develop a plan to enhance their Photoshop aptitudes.
- CONSTRUCT multiple Photoshop projects for their design portfolios.
GUIDED LEARNING ACTIVITIES- Sign into drive.google.com. Create a new doc named Your Name Photoshop Plan.
- IDENTIFY at least 3 learning goals that pertain to what you would like to get better at with Photoshop.
- Ex. I would like to get better at (compositing, logo design, layer masks, filters, banners, photo effects, etc.)
- IDENTIFY and complete 3-5 tutorials that will help you achieve your goals.
- Save as PSE1.psd, PSE2.psd, and PSE3.psd to H:/Photoshop. Convert each .psd to .jpg (File>Save for Web).
- Format for Photoshop Plan Doc (include 3 designs). [60 marks possible]
- IDENTIFY your goal [1 mark]
- Insert a .jpg or screenshots showing progression of each design. [10 marks]
- IDENTIFY the URL for each tutorial that was used. [1 mark]
- EXPLAIN the design, the tools and techniques that were used. [6 marks]
- DESCRIBE how the tutorial helped you achieve your goal. [2 marks]
- How to Submit: Change the sharing settings of your Photoshop Plan doc to "anyone with the link can EDIT". Copy the link. Return to Edmodo. Click the turn in button above then submit the link to your shared document.
NO HOMEWORKGo to Week 06